@charset "UTF-8";
*{box-sizing: border-box;}
@function rem($px) {
  @return $px / 32 + rem
}

header {
  height: rem(75);
  width: 100%;
  background: url("../img/head_bg.png");
  text-align: center;
  position: fixed;
  top: 0;
  #hd_fh{
    font-size: rem(30);
    color: #fff;
    position: absolute;
    left: rem(10);
    top:rem(23);
  }
  #title {
    font-size: rem(30);
    line-height: rem(75);
    a{color: #fff;}
}

}
.reg_banner{
  width: 100%;
  height: rem(258);
  background: url("../img/head_bg.png");
  margin-top: rem(75);
  .ban_img{
    width: rem(308);
    margin: 0 auto;
    img{
      width: 100%;
    }
  }
}
.reg_list{
  height: rem(78);
  width: 100%;
  background: #ffb900;
  display: flex;
  justify-content: space-around;
  position: relative;
  div{
    p{
      padding: 0 5px;
      height: rem(77);
      font-size: rem(24);
      line-height: rem(78);
      color: #fee2b3;
    }
  }
  ul{
    width: 100%;
    position: absolute;
    top: rem(78);left: 0;
    display: none;
    li{
      width: 100%;
      padding: rem(30);
      border-bottom: 1px solid #9d9d9d;
      h4{
        color: #000;
        font-size: rem(30);
        font-weight: 400;
        padding-bottom: rem(10);
      }
      div{
        color: #ffcd7f;
        display: flex;
        span{
          padding: 2px 5px;
          border: 1px solid #ffcd7f;
          border-radius: 20px;
          margin-right: 5px;
        }
        .color1{color: #41b5fe;border: 1px solid #41b5fe;}
        .color2{color: #f97046;border: 1px solid #f97046;}
      }
      p{
        margin-top: 12px;
        color: #9d9d9d;
      }
    }
  }
  .show{display: block;}
  .btm{border-bottom: 2px solid #fff;color: #fff;}
}

.reg_zg{
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.4);
  position: fixed;
  top: rem(75);
  display: none;
  .tent{
    width: 100%;
    background: #fff;
    border: 1px solid #fff;
    ul{
      width: 94%;
      margin: 20px auto;
      li:first-child{
        width: 100%;
        padding-bottom: rem(24);
        span{
          display: block;
          width: rem(182);
          height: rem(68);
          text-align: center;
          line-height: rem(68);
          color: white;
          background: #ffad2d;
          border: 1px solid #ffa00d;
          border-radius: 5px;
          font-size: rem(26);
        }
      }
      li{
        width: 100%;
        div:first-child{
          width: 100%;
          display: flex;
          justify-content: space-between;
          font-size: rem(18);
          color: #a7a7a7;
          p{
            width: rem(244);
            height: 1px;
            background: #f1f1f1;
            margin-top: 8px;
          }
        }
        div:last-child{
          width: 100%;
          display: flex;
          padding: rem(45) 0;
          span{
            display: block;
            width: rem(182);
            height: rem(68);
            color: #090909;
            background: #e0e0e0;
            text-align: center;
            line-height: rem(68);
            margin-right: rem(25);
            border-radius: 5px;
            font-size: rem(26);
          }
          .span_bg2{
            color: #fff;
            background: #ffad2d;
          }
        }
      }
    }
  }
  .kong{
    width: 100%;
    height: 100%;
  }
}

